﻿@using Blogifier.Core.Data
@inject IDataService DataService
@{
    AppSettings.SiteRoot = Url.Content("~/");
    var img = $"{AppSettings.SiteRoot}themes/philosophy/images";
    var imgPlaceholder = $"{AppSettings.SiteRoot}admin/img/img-placeholder.png";
    var m = Model as ListModel;
    var pgr = m.Pager;

    var coverPost = m.Posts.Where(p => p.Featured == false).FirstOrDefault();
    if(coverPost == null)
    {
        coverPost = m.Posts.FirstOrDefault();
    }
    var featured = DataService.BlogPosts.GetList(new Pager(1), 0, "", "F").Result.ToList(); // flist.ToList();
}
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
    <!--- basic page needs
    ================================================== -->
    <meta charset="utf-8">
    <!-- mobile specific metas
    ================================================== -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <!-- CSS
    ================================================== -->
    <link rel="stylesheet" href="~/themes/philosophy/css/base.css">
    <link rel="stylesheet" href="~/themes/philosophy/css/vendor.css">
    <link rel="stylesheet" href="~/themes/philosophy/css/main.css">
    <!-- script
    ================================================== -->
    <script src="~/themes/philosophy/js/modernizr.js"></script>
    <script src="~/themes/philosophy/js/pace.min.js"></script>

    <!-- favicons
    ================================================== -->
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="icon" href="favicon.ico" type="image/x-icon">

    <partial name="~/Views/Shared/HeaderScript.cshtml" />
</head>

<body id="top">

    <!-- pageheader
    ================================================== -->
    <section class="s-pageheader s-pageheader--home">

        <partial name="~/Views/Themes/Philosophy/Shared/Header.cshtml" />

        <div class="pageheader-content row">
            <div class="col-full">

                <div class="featured">

                    <div class="featured__column featured__column--big">
                        @if (coverPost == null)
                        {
                            <div class="entry" style="background-image:url('@imgPlaceholder');">
                                <div class="entry__content">&nbsp;</div>
                            </div>
                        }
                        else
                        {
                            var cats0 = string.IsNullOrEmpty(coverPost.Categories)
                                ? null : coverPost.Categories.Split(',').ToList();
                            <div class="entry" style="background-image:url('@AppSettings.SiteRoot@coverPost.Cover');">
                                <div class="entry__content">
                                    @if (cats0 != null)
                                    {
                                        foreach (var cat in cats0)
                                        {
                                            <span class="entry__category"><a href="~/categories/@cat">@cat</a></span>
                                        }
                                    }
                                    <h1><a href="~/posts/@coverPost.Slug" title="">@coverPost.Title</a></h1>
                                    <div class="entry__info">
                                        <a href="#" class="entry__profile-pic">
                                            <img class="avatar" src="~/@coverPost.Author.Avatar" alt="">
                                        </a>

                                        <ul class="entry__meta">
                                            <li><a href="#">@coverPost.Author.DisplayName</a></li>
                                            <li>@coverPost.Published.ToFriendlyDateString()</li>
                                            <li><span><i class="fa fa-eye" aria-hidden="true"></i> @coverPost.PostViews</span></li>
                                            <li>
                                                <span>
                                                    <i class="fa fa-comments-o" aria-hidden="true"></i>
                                                    <a href="posts/@coverPost.Slug#disqus_thread"></a>
                                                </span>
                                            </li>
                                        </ul>
                                    </div>
                                </div> <!-- end entry__content -->
                            </div> <!-- end entry -->
                        }
                    </div> <!-- end featured__big -->

                    <div class="featured__column featured__column--small">

                        @if (featured != null && featured.Count > 0)
                        {
                            var cats1 = string.IsNullOrEmpty(featured[0].Categories)
                                ? null : featured[0].Categories.Split(',').ToList();
                            <div class="entry" style="background-image:url('@AppSettings.SiteRoot@featured[0].Cover');">
                                <div class="entry__content">
                                    @if (cats1 != null)
                                    {
                                        foreach (var cat in cats1)
                                        {
                                            <span class="entry__category"><a href="~/categories/@cat">@cat</a></span>
                                        }
                                    }
                                    <h1><a href="~/posts/@featured[0].Slug" title="">@featured[0].Title</a></h1>
                                    <div class="entry__info">
                                        <a href="#" class="entry__profile-pic">
                                            <img class="avatar" src="~/@featured[0].Author.Avatar" alt="">
                                        </a>

                                        <ul class="entry__meta">
                                            <li><a href="#">@featured[0].Author.DisplayName</a></li>
                                            <li>@featured[0].Published.ToFriendlyDateString()</li>
                                            <li><a href="#"><i class="fa fa-eye" aria-hidden="true"></i> @featured[0].PostViews</a></li>
                                            <li>
                                                <span>
                                                    <i class="fa fa-comments-o" aria-hidden="true"></i>
                                                    <a href="posts/@featured[0].Slug#disqus_thread"></a>
                                                </span>
                                            </li>
                                        </ul>
                                    </div>
                                </div> <!-- end entry__content -->

                            </div> <!-- end entry -->
                        }
                        else
                        {
                            <div class="entry" style="background-image:url('@imgPlaceholder');"></div>
                        }
                        @if (featured != null && featured.Count > 1)
                        {
                            var cats2 = string.IsNullOrEmpty(featured[1].Categories)
                                ? null : featured[1].Categories.Split(',').ToList();
                            <div class="entry" style="background-image:url('@AppSettings.SiteRoot@featured[1].Cover');">
                                <div class="entry__content">
                                    @if (cats2 != null)
                                    {
                                        foreach (var cat in cats2)
                                        {
                                            <span class="entry__category"><a href="~/categories/@cat">@cat</a></span>
                                        }
                                    }
                                    <h1><a href="~/posts/@featured[1].Slug" title="">@featured[1].Title</a></h1>
                                    <div class="entry__info">
                                        <a href="#" class="entry__profile-pic">
                                            <img class="avatar" src="~/@featured[1].Author.Avatar" alt="">
                                        </a>
                                        <ul class="entry__meta">
                                            <li><a href="#">@featured[1].Author.DisplayName</a></li>
                                            <li>@featured[1].Published.ToFriendlyDateString()</li>
                                            <li><a href="#"><i class="fa fa-eye" aria-hidden="true"></i> @featured[1].PostViews</a></li>
                                            <li>
                                                <span>
                                                    <i class="fa fa-comments-o" aria-hidden="true"></i>
                                                    <a href="posts/@featured[1].Slug#disqus_thread"></a>
                                                </span>
                                            </li>
                                        </ul>
                                    </div>
                                </div> <!-- end entry__content -->
                            </div> <!-- end entry -->
                        }
                        else
                        {
                            <div class="entry" style="background-image:url('@imgPlaceholder');"></div>
                        }

                    </div> <!-- end featured__small -->
                </div> <!-- end featured -->

            </div> <!-- end col-full -->
        </div> <!-- end pageheader-content row -->

    </section> <!-- end s-pageheader -->
    <!-- s-content
    ================================================== -->
    <section class="s-content">

        <div class="row masonry-wrap">
            <div class="masonry">

                <div class="grid-sizer"></div>

                @foreach (var post in m.Posts)
                {
                    <article class="masonry__brick entry format-standard" data-aos="fade-up">
                        <div class="entry__thumb">
                            <a href="~/posts/@post.Slug" class="entry__thumb-link">
                                <img src="~/@post.Cover" alt="">
                            </a>
                        </div>
                        <div class="entry__text">
                            <div class="entry__header">
                                <div class="entry__date">
                                    <a href="~/posts/@post.Slug">@post.Published.ToFriendlyDateString()</a>
                                    <span style="float:right">
                                        <a href="#"><i class="fa fa-eye" aria-hidden="true"></i> @post.PostViews</a>
                                        <i class="fa fa-comments-o" aria-hidden="true"></i>
                                        <a href="posts/@post.Slug#disqus_thread"></a>
                                    </span>
                                </div>
                                <h1 class="entry__title"><a href="~/posts/@post.Slug">@post.Title</a></h1>
                            </div>
                            <div class="entry__excerpt">
                                @Html.Raw(post.Description)
                            </div>
                            @if (!string.IsNullOrEmpty(post.Categories))
                            {
                                var cats = post.Categories.Split(',').ToList();
                                <div class="entry__meta">
                                    <span class="entry__meta-links">
                                        @foreach (var cat in cats)
                                        {
                                            if (!string.IsNullOrEmpty(cat))
                                            {
                                                <a href="~/categories/@cat">@cat</a>
                                            }
                                        }
                                    </span>
                                </div>
                            }
                        </div>
                    </article>
                }

            </div>
        </div>

        @if (pgr != null && (pgr.ShowOlder || pgr.ShowNewer))
        {
            <div class="row">
                <div class="col-full">
                    <nav class="pgn">
                        <ul>
                            @if (pgr.ShowOlder)
                            {
                                <li><a class="pgn__prev" href="@pgr.LinkToOlder">Prev</a></li>
                            }
                            <li><span class="pgn__num current">@pgr.CurrentPage</span></li>
                            <li><span class="pgn__num dots">out of @pgr.LastPage</span></li>
                            @if (pgr.ShowNewer)
                            {
                                <li><a class="pgn__next" href="@pgr.LinkToNewer">Next</a></li>
                            }
                        </ul>
                    </nav>
                </div>
            </div>
        }

    </section> <!-- s-content -->

    <partial name="~/Views/Themes/Philosophy/Shared/Footer.cshtml" />
</body>

</html>